<template>
  <div>
    <div class="job-intention primary-text" v-if="form.sta != 1 || form.editSta != data.id">
      <div style="display:flex;justify-content: flex-start;">
        <div style="margin:0 30px 0 0;display: flex;
    align-items: center;">
          <img src="../../../assets/img/resume/dingwei.png" alt>
          {{data.hopeCity}}
          <!--武汉-->
        </div>
        <div style="margin:0 30px 0 0;display: flex;
    align-items: center;">
          <img src="../../../assets/img/resume/zhiyeleixin.png" alt>
          {{data.parentLicenseType}}-{{data.sonLicenseType}}
          <!--执业类型-->
        </div>
        <div style="margin:0 30px 0 0;display: flex;
    align-items: center;">
          <img src="../../../assets/img/resume/qiyeleixing.png" alt>
          {{data.hopeCompanyType}}
          <!--企业类型-->
        </div>
        <div style="margin:0 30px 0 0;display: flex;
    align-items: center;">
          <img src="../../../assets/img/resume/money.png" alt>
          <span v-if="data.tax == 0">税前&nbsp;</span>
          <span v-if="data.tax == 1">税后&nbsp;</span>
          {{data.salaryPerMonthLow ? data.salaryPerMonthLow : '---'}}-{{data.salaryPerMonthHigh ? data.salaryPerMonthHigh + 'W' : '---'}}/
          <span
            style="color:#666;font-size:12px;"
          >{{data.monthCount ? data.monthCount + '年' : '---'}}</span>
        </div>
      </div>
      <div style="display:flex;justify-content: flex-end;algin-items:center">
        <div class="orange-text" style="margin:0 10px 0 0;">
          <div @click="editContent(data.id)" class="icon-text-center">
            <img src="../../../assets/img/resume/bianji.png" alt>
            编辑
          </div>
        </div>
        <div class="orange-text">
          <div @click="detele(data.id)" class="icon-text-center">
            <img src="../../../assets/img/resume/detele.png" width="16px" height="16px" alt>
            删除
          </div>
        </div>
      </div>
    </div>

    <div class="edit-content" v-if="form.sta == 1 && form.editSta == data.id">
      <div class="all-job-resume" style="padding:24px 0 0 0; background:#f7fdff;">
        <el-form label-width="100px" label-position="right">
          <el-row>
            <el-col :span="12">
              <el-form-item label="期望城市">
                <el-cascader
                  :options="city"
                  @change="getData"
                  placeholder="所在城市"
                  v-model="workCity"
                ></el-cascader>
              </el-form-item>
              <el-form-item label="期望企业类型">
                <el-select class="all-input" v-model="data.hopeCompanyTypeId">
                  <el-option
                    v-for="(item,index) in enterpriseType"
                    :key="index"
                    :label="item.content"
                    :value="item.id"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="11" :offset="1">
              <el-form-item label="期望执业类型">
                <el-cascader :options="practiceType||[]" :props="props" v-model="licenseIds"></el-cascader>
              </el-form-item>
              <el-form-item label="期望年薪">
                <el-col :span="16">
                  <el-input v-model="data.salaryPerMonthLow" class="theme-input money-input"></el-input>&nbsp;-&nbsp;
                  <el-input v-model="data.salaryPerMonthHigh" class="theme-input money-input"></el-input>&nbsp;W/&nbsp;
                  <el-input v-model="data.monthCount" class="theme-input money-input"></el-input>&nbsp;年
                </el-col>
                <el-col :span="8">
                  <el-radio-group v-model="data.tax">
                    <el-radio :label="0">税前</el-radio>
                    <el-radio :label="1">税后</el-radio>
                  </el-radio-group>
                </el-col>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item class="form-button-right">
            <el-button class="ghost-button" @click="cancel">取消</el-button>
            <el-button class="submit-button" @click="onSubmit">确认</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
import { chinaOptions, CodeToText, TextToCode } from '@/assets/utils/china.js'
import { constants } from 'crypto'
export default {
  props: ['form', 'enterpriseType', 'practiceType', 'data'],
  data() {
    return {
      city: chinaOptions,
      workCity: [],
      licenseIds: [],
      hopeCity: '',
      props: {
        value: 'licenseTypeId',
        children: 'licenseSonList',
        label: 'licenseType'
      }
    }
  },
  methods: {
    check() {
      if (
        this.data.salaryPerMonthLow == null ||
        this.data.salaryPerMonthHigh == null ||
        this.data.monthCount == null
      ) {
        _g.message('请输入数据', 'warning')
        return false
      }
      if (this.data.salaryPerMonthHigh - this.data.salaryPerMonthLow > 5) {
        _g.message('期望年薪最大值与最小值不能超过5W', 'warning')
        return false
      }
      return true
    },
    editContent(id) {
      this.form.sta = 1
      this.form.editSta = id
    },
    detele(id) {
      //删除期望职位
      // console.log('删除期望职位')
      _g.apiPost('/talent/deleteJobIntention.do', { hopJobId: id }).then(
        res => {
          _g.toMessage(res)
          this.$emit('on-pitch', true)
        }
      )
    },
    cancel() {
      this.$emit('on-pitch', true)
      this.form.sta = -1
      this.form.editSta = -1
    },
    onSubmit() {
      // console.log(this.data)
      if (!this.check()) return false
      let params = {
        id: this.data.id,
        hopeCity: this.data.hopeCity,
        hopeCompanyType: this.data.hopeCompanyTypeId,
        hopeLicence: this.licenseIds[1],
        salaryPerMonthLow: this.data.salaryPerMonthLow,
        salaryPerMonthHigh: this.data.salaryPerMonthHigh,
        yearNum: this.data.monthCount,
        taxType: this.data.tax
      }
      _g.apiPost('/talent/updateJobIntention.do', params).then(res => {
        _g.toMessage(res)
        this.cancel()
      })
    },
    getData(val) {
      // let l = []
      // for (let i in val) {
      //   l.push(CodeToText[val[i]])
      // }
      this.data.hopeCity = val.join('-')
    },
    setData() {
      // let l = []
      this.workCity = this.data.hopeCity.split('-')
      // this.workCity.push(TextToCode[l[0]])
      // this.workCity.push(TextToCode[l[0]][l[1]])
      this.licenseIds = JSON.parse(this.data.licenseIds)
    }
  },
  mounted() {
    this.setData()
  },
  components: {}
}
</script>

<style lang="scss" scoped>
.icon-text-center {
  display: flex;
  align-items: center;
}
</style>
